<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>注册</title>
    <link rel="stylesheet" href="../assets/css/style.css" />
</head>

<body>
    <div id="app">
        <div class="container">
            <span id="message">{{ msg|json }}</span>
        </div>
        <div class="container">
            <div class="form-group">
                <label>电子邮箱</label>
                <input type="text" v-model="registerModel.email" />
            </div>
            <div class="form-group">
                <label>密码</label>
                <input type="text" v-model="registerModel.password" />
            </div>

            <div class="form-group">
                <label>确认密码</label>
                <input type="text" v-model="registerModel.confirmPassword" />
            </div>

            <div class="form-group">
                <label></label>
                <button @click="register">注册</button>
            </div>
        </div>
    </div>
</body>

<script src="../assets/js/vue.js"></script>
<script src="../assets/js/vue-resource.js"></script>
<script src="../assets/js/zepto.js"></script>
<script>
    new Vue(
        {
            el: "#app",
            data: {
                registerUrl: 'http://localhost:6688/api/Account/Register',
                registerModel: {
                    email: '',
                    password: '',
                    confirmPassword: ''
                },
                msg: ''
            },
            methods: {
                register: function () {
                    var vm = this;
                    vm.msg = '';
                    //     $.ajax({
                    //         url: vm.registerUrl,
                    //         type: 'post',
                    //         dataType: 'json',
                    //         data: vm.registerModel,
                    //         success: function () {
                    //             vm.msg = "注册成功";
                    //         },
                    //         error: vm.requestError
                    //     });
                    this.$http.post(this.registerUrl, this.registerModel,{ emulateJSON : true}).
                        then((response) => {
                            this.msg = '注册成功'
                        }).catch((response) => {
                            this.msg = response.json()
                        })
                },
                requestError: function (xhr, errorType, error) {
                    this.msg = xhr.responseText;
                }
            }
        }
    );

</script>

</html>